<link href="styles/datepicker3.css" rel="stylesheet">
<link href="styles/styles.css" rel="stylesheet">

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#sidebar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand"><span>用户操作页面</span></a>
            <ul class="user-menu">
                <li class="dropdown pull-right">
                    <a class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-user"></span> {{username}} <span class="caret"></span></a>
                </li>
            </ul>
        </div>
    </div><!-- /.container-fluid -->
</nav>

<div id="sidebar-collapse" class="col-sm-3 col-lg-2 sidebar">
    <ul class="nav menu">
        <li><a href="/arithmetic/MyApp/#/work/studentInformation/{{username}}"><span class="glyphicon glyphicon-dashboard"></span> 学生信息</a></li>
        <li><a href="/arithmetic/MyApp/#/work/arithmeticExerciseCopy/{{username}}"><span class="glyphicon glyphicon-list-alt"></span> 简单算术练习</a></li>
        <li><a href="/arithmetic/MyApp/#/work/arithmeticExercise2Copy/{{username}}"><span class="glyphicon glyphicon-pencil"></span> 混合运算练习</a></li>
        <li><a href="/arithmetic/MyApp/#/work/arithmeticExercise/{{username}}"><span class="glyphicon glyphicon-th"></span> 简单算术测试</a></li>
        <li><a href="/arithmetic/MyApp/#/work/arithmeticExercise2/{{username}}"><span class="glyphicon glyphicon-stats"></span> 混合运算测试</a></li>
    </ul>
</div><!--/.sidebar-->

<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2 main">
    <div class="row">
        <ol class="breadcrumb">
            <li><a ><span class="glyphicon glyphicon-home"></span></a></li>
            <li class="active">学生信息</li>
        </ol>
    </div><!--/.row-->

    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">学生信息</h1>
        </div>
    </div><!--/.row-->


    <div class="row">
        <div class="col-xs-12 col-md-6 col-lg-3">
            <div class="panel panel-blue panel-widget ">
                <div class="row no-padding">
                    <div class="col-sm-3 col-lg-5 widget-left">
                        <em class="glyphicon glyphicon-align-justify glyphicon-l"></em>
                    </div>
                    <div class="col-sm-9 col-lg-7 widget-right">
                        <div class="large">120</div>
                        <div class="text-muted">练习次数</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-md-6 col-lg-3">
            <div class="panel panel-orange panel-widget">
                <div class="row no-padding">
                    <div class="col-sm-3 col-lg-5 widget-left">
                        <em class="glyphicon glyphicon-stats glyphicon-l"></em>
                    </div>
                    <div class="col-sm-9 col-lg-7 widget-right">
                        <div class="large">52%</div>
                        <div class="text-muted">总正确率</div>
                    </div>
                </div>
            </div>
        </div>
    </div><!--/.row-->
    <div class="row">
        <div class="col-lg-12">
            <div class="panel panel-default">
                <div class="panel-heading">近期成绩状况</div>
                <div class="panel-body">
                    <div class="canvas-wrapper">
                        <canvas class="main-chart" id="line-chart" height="200" width="600"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div><!--/.row-->
    <div class="row">
        <div class="col-xs-6 col-md-3">
            <div class="panel panel-default">
                <div class="panel-body easypiechart-panel">
                    <h4>加法正确率</h4>
                    <div class="easypiechart" id="easypiechart-blue" data-percent="90" ><span class="percent">{{easyPieChartData[0]}}%</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-6 col-md-3">
            <div class="panel panel-default">
                <div class="panel-body easypiechart-panel">
                    <h4>减法正确率</h4>
                    <div class="easypiechart" id="easypiechart-orange" data-percent="{{easyPieChartData[1]}}" ><span class="percent">{{easyPieChartData[1]}}%</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-6 col-md-3">
            <div class="panel panel-default">
                <div class="panel-body easypiechart-panel">
                    <h4>乘法正确率</h4>
                    <div class="easypiechart" id="easypiechart-teal" data-percent="56" ><span class="percent">{{easyPieChartData[2]}}%</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-6 col-md-3">
            <div class="panel panel-default">
                <div class="panel-body easypiechart-panel">
                    <h4>除法正确率</h4>
                    <div class="easypiechart" id="easypiechart-red" data-percent="50" ><span class="percent">{{easyPieChartData[3]}}%</span>
                    </div>
                </div>
            </div>
        </div>
    </div><!--/.row-->
</div>	<!--/.main-->
